<template>
    <div class="mine" style="padding-top:50px">
        <p>num:  {{_num}} {{num}}</p>
        <p><button @click="changeNum">changeNum</button></p>
        <Tabbar></Tabbar>
    </div>
</template>

<script>
/* 
    ...展开运算符
    let a = {name:"张三"}
    let b = {age:20,...a} //{age:20,a:{name:"张三"}} ==> {age:20,name:"张三"}
    console.log(b)

    //案例二
    let arr = [3,4,5,6,7]
    let b = [...arr]
    console.log(b)


    ...剩余操作符
    function fn(...a){
        console.log(a) //[1,2,3]
    }
    fn(1,2,3)
*/

import Tabbar from "@/components/Tabbar" 
import {mapState} from "vuex"
export default {
    name:"mine",
    // data(){
    //     return {
    //         num:this.$store.state.num
    //     }
    // },
    // computed:{
    //     num(){
    //         return this.$store.state.num
    //     }
    // },

    //computed:mapState(["num"]),
    computed:{
        // ...mapState(["num"]),
        ...mapState({
            _num:state=>state.num
        }),
        num(){
            return "11111111111"
        }
    },
    methods:{
        changeNum(){
            //需要让mutations具体的changeNum方法进行调用
            this.$store.commit("changeNum")
        }
    },
    components:{
        Tabbar
    },
    created(){
    }
}
</script>

<style>

</style>
